<div class="container-xl">
  <!-- Page title -->
  <div class="page-header d-print-none">
    <div class="row align-items-center">
      <div class="col">
        <h2 class="page-title">
          过滤规则
        </h2>
      </div>
      <div class="col-auto ms-auto d-print-none">
        <div class="btn-list">
          <a href="javascript:show_add_filtergroup_modal()" class="btn btn-primary d-none d-sm-inline-block">
            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><line x1="12" y1="5" x2="12" y2="19" /><line x1="5" y1="12" x2="19" y2="12" /></svg>
            新增规则组
          </a>
          <a href="javascript:show_add_filtergroup_modal()" class="btn btn-primary d-sm-none btn-icon">
            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><line x1="12" y1="5" x2="12" y2="19" /><line x1="5" y1="12" x2="19" y2="12" /></svg>
          </a>
        </div>
      </div>
    </div>
  </div>
</div>
<!-- 业务页面代码 -->
{% if Count > 0 %}
<div class="page-body">
  <div class="container-xl">
    <div class="row row-cards">
      {% for RuleGroup in RuleGroups %}
      <div class="col-12 col-md-6 col-xl-4">
        <div class="card">
          <div class="card-header">
            <h3 class="card-title"><strong>{{ RuleGroup.name }}</strong></h3>
            <div class="card-actions btn-actions">
              <a href="javascript:set_default_filtergroup('{{ RuleGroup.id }}')" class="btn-action" title="设置/取消默认">
                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-star {% if RuleGroup.default == 'Y' %}icon-filled text-green{% endif %}" width="40" height="40" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                  <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                  <path d="M12 17.75l-6.172 3.245l1.179 -6.873l-5 -4.867l6.9 -1l3.086 -6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z"></path>
                </svg>
              </a>
              <a href="javascript:show_add_filterrule_modal('{{ RuleGroup.id }}', '{{ RuleGroup.name }}')" class="btn-action" title="增加规则">
                <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-plus" width="40" height="40" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                 <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                 <line x1="12" y1="5" x2="12" y2="19"></line>
                 <line x1="5" y1="12" x2="19" y2="12"></line>
                </svg>
              </a>
              <a href="javascript:del_filtergroup_modal('{{ RuleGroup.id }}', '{{ RuleGroup.name }}')" class="btn-action" title="删除规则组">
                <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><desc>Download more icon variants from https://tabler-icons.io/i/x</desc><path stroke="none" d="M0 0h24v24H0z" fill="none"/><line x1="18" y1="6" x2="6" y2="18" /><line x1="6" y1="6" x2="18" y2="18" /></svg>
              </a>
            </div>
          </div>
          <div class="card-body">
            <div class="row row-cards">
              {% if RuleGroup.rules %}
              {% for Rule in RuleGroup.rules %}
              <div class="col-12">
                <a class="card card-link card-link-pop card-borderless" href="javascript:show_modify_filterrule_modal('{{ RuleGroup.id }}', '{{ Rule.id }}', '{{ RuleGroup.name }}')" title="编辑规则">
                  <div class="card-body">
                    <h3 class="card-title">{{ Rule.name }}</h3>
                    <div class="w-100">
                      {% for include in Rule.include %}
                        <span class="badge badge-outline text-green me-1 mb-1 text-wrap text-start" title="包含规则">包含: {{ include }}</span>
                      {% endfor %}
                      {% for exclude in Rule.exclude %}
                        <span class="badge badge-outline text-red me-1 mb-1 text-wrap text-start" title="排除规则">排除: {{ exclude }}</span>
                      {% endfor %}
                      {% if Rule.size %}
                        <span class="badge badge-outline text-orange me-1 mb-1 text-wrap text-start" title="大小限制">大小: {{ Rule.size }}</span>
                      {% endif %}
                    </div>
                  </div>
                </a>
              </div>
              {% endfor %}
              {% else %}
              <div class="text-muted mt-2">未设置规则</div>
              {% endif %}
            </div>
          </div>
        </div>
      </div>
      {% endfor %}
    </div>
  </div>
</div>
{% else %}
<div class="page-body">
  <div class="container-xl d-flex flex-column justify-content-center">
    <div class="empty">
      <div class="empty-img"><img src="./static/img/sign_in.svg" height="128"  alt="">
      </div>
      <p class="empty-title">没有规则</p>
      <p class="empty-subtitle text-muted">
        没有配置任何规则，请点击“新增规则组“按钮。
      </p>
    </div>
  </div>
</div>
{% endif %}
<div class="modal modal-blur fade" id="modal-add-filterrule" tabindex="-1" role="dialog" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
  <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="card border-top-0">
        <div class="card-header">
          <h5 class="modal-title" id="modal-filterrule-title">新增规则</h5>
          <input type="hidden" id="filterrule_id" />
          <input type="hidden" id="filtergroup_id" />
          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
        </div>
        <div class="card-body">
          <div class="row">
            <div class="col-lg-6">
              <div class="mb-3">
                <label class="form-label required">规则名称</label>
                <input type="text" class="form-control" id="rule_name" placeholder="自定义规则名称">
              </div>
            </div>
            <div class="col-lg-6">
              <div class="mb-3">
                <label class="form-label">优先级 <span class="form-help bg-red-lt" title="同一个规则组内，规则优先级的数值越小优先级越高" data-bs-toggle="tooltip">?</span></label>
                <select class="form-select" id="rule_pri">
                  <option value="1" selected>1</option>
                  <option value="2">2</option>
                  <option value="3">3</option>
                  <option value="4">4</option>
                  <option value="5">5</option>
                  <option value="6">6</option>
                  <option value="7">7</option>
                  <option value="8">8</option>
                  <option value="9">9</option>
                  <option value="10">10</option>
                  <option value="11">11</option>
                  <option value="12">12</option>
                  <option value="13">13</option>
                  <option value="14">14</option>
                  <option value="15">15</option>
                  <option value="16">16</option>
                  <option value="17">17</option>
                  <option value="18">18</option>
                  <option value="19">19</option>
                  <option value="20">20</option>
                </select>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-lg-6">
              <div class="mb-3">
                <label class="form-label">包含规则 <span class="form-help bg-red-lt" title="只有种子标题或副标题中包括这些关键字或匹配正式表达式才会命中；对大小写不敏感，配置为空为不启用该规则；可以配置多行，多行之间是【与】的关系，即多行条件都包含时才会命中，单行内可以用'|'来表示【或】，即包括其一即命中" data-bs-toggle="tooltip">?</span></label>
                <textarea class="form-control" id="rule_include" rows="4" placeholder="必须包含的关键字或正则表达式"></textarea>
              </div>
            </div>
            <div class="col-lg-6">
              <div class="mb-3">
                <label class="form-label">排除规则 <span class="form-help bg-red-lt" title="种子标题或副标题中如果有这些关键字或匹配正式表达式则会被跳过；对大小写不敏感，不能带引号，配置为空为不启用该规则；可以配置多行，多行之间是【与】的关系，即多行条件都不包含时才会跳过，单行内可以用'|'来表示【或】，即包括其一即跳过" data-bs-toggle="tooltip">?</span></label>
                <textarea class="form-control" id="rule_exclude" rows="4" placeholder="不能包含的关键字或正则表达式"></textarea>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-lg-6">
              <div class="mb-3">
                <label class="form-label">大小限制(GB) <span class="form-help bg-red-lt" title="只有满足大小限制的种子文件才会被命中，单位是GB；不配置则不启用该条件；如只配置1个数字表示小于等于该大小的才会被命中；如配置2个数字(使用英文逗号分隔)表示在中间大小的才会被命中" data-bs-toggle="tooltip">?</span></label>
                <input type="text" class="form-control" id="rule_sizelimit" value="" placeholder="限制文件大小，单位GB" autocomplete="off">
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button id="filterrule_close_btn" class="btn btn-link">
          取消
        </button>
        <button id="add_or_edit_filterrule_btn" class="btn btn-primary ms-auto" onclick="javascript:add_filterrule()">
          新增
        </button>
      </div>
    </div>
  </div>
</div>
<div class="modal modal-blur fade" id="modal-add-filtergroup" tabindex="-1" role="dialog" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
  <div class="modal-dialog modal-sm modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="card border-top-0">
        <div class="card-header">
          <h5 class="modal-title">新增规则组</h5>
          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
        </div>
        <div class="card-body">
          <div class="row">
            <div class="col">
              <div class="mb-3">
                <label class="form-label required">规则组名称 <span class="form-help bg-red-lt" title="规则组为规则使用的基本单位，一个规则组中可以包含多条规则，按优先级依次匹配，给规则组设定个名称以便于选择使用" data-bs-toggle="tooltip">?</span></label>
                <input type="text" class="form-control" id="rulegroup_name" placeholder="别名">
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-xl-4">
              <div class="mb-3">
                <label class="form-check form-switch">
                  <input class="form-check-input" type="checkbox" id="rulegroup_default" onclick="javascript:change_over_edition_check(this)">
                  <span class="form-check-label">默认 <span class="form-help bg-red-lt" title="将该规则组设为默认规则，在远程搜索、订阅等未指定规则组的场景下默认使用" data-bs-toggle="tooltip">?</span></span>
                </label>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <a class="btn btn-link" data-bs-dismiss="modal">
          取消
        </a>
        <a id="add_rulegroup_btn" class="btn btn-primary ms-auto" href="javascript:add_filtergroup()">
          新增
        </a>
      </div>
    </div>
  </div>
</div>

<script type="text/javascript">
  // 打开新增规则表窗口
  function show_add_filtergroup_modal(){
    $("#filterrule_id").val("");
    $("#modal-add-filtergroup").modal('show');
  }

  // 打开新增规则窗口
  function show_add_filterrule_modal(groupid, groupname){
    $("#modal-filterrule-title").text("新增规则：" + groupname);
    $("#filtergroup_id").val(groupid);
    $("#filterrule_close_btn").text("取消");
    $("#add_or_edit_filterrule_btn").text("新增");
    $("#filterrule_close_btn").unbind('click');
    $("#filterrule_close_btn").click(function(){
      $("#modal-add-filterrule").modal('hide');
    });
    $("#modal-add-filterrule").modal('show');
  }

  // 设置默认规则组
  function set_default_filtergroup(id){
    ajax_post("set_default_filtergroup", {"id": id}, function(ret){
      navmenu('filterrule');
    });
  }

  //修改规则
  function show_modify_filterrule_modal(groupid, ruleid, groupname){
    $("#modal-filterrule-title").text("编辑规则：" + groupname);
    $("#filterrule_id").val(ruleid);
    $("#filtergroup_id").val(groupid);
    //获取数据
    ajax_post("filterrule_detail", {"ruleid": ruleid, "groupid": groupid}, function(ret){
      if(ret.info){
        $("#rule_name").val(ret.info.name);
        $("#rule_pri").val(ret.info.pri);
        $("#rule_include").val(ret.info.include);
        $("#rule_exclude").val(ret.info.exclude);
        $("#rule_sizelimit").val(ret.info.size);
        $("#filterrule_close_btn").text("删除");
        $("#add_or_edit_filterrule_btn").text("修改");
        $("#filterrule_close_btn").unbind('click');
        $("#filterrule_close_btn").click(function(){
          delete_filterrule(ret.info.id);
        });
        $("#modal-add-filterrule").modal('show');
      }
    });
  }

  // 新增规则组
  function add_filtergroup(){
    var name = $("#rulegroup_name").val();
    if(!name){
      $("#rulegroup_name").addClass("is-invalid");
      return;
    } else {
      $("#rulegroup_name").removeClass("is-invalid");
    }
    if($("#rulegroup_default").prop("checked")){
      var is_default = 'Y';
    }else{
      var is_default = 'N';
    }
    var params = {"name": name, "default": is_default};
    ajax_post("add_filtergroup", params, function (ret) {
      if(ret.code == 0){
        $("#modal-add-filtergroup").modal('hide');
        navmenu('filterrule');
      }
    });
  }

  //删除规则组
  function del_filtergroup_modal(id, name){
    show_confirm_modal("删除规则组后，该组下所有的规则将会同时被删除，是否确认删除 " + name + " ？" , function(){
      hide_confirm_modal();
      ajax_post("del_filtergroup", {"id": id}, function(ret){
        navmenu('filterrule');
      });
    });
  }

  // 新增规则
  function add_filterrule(){
    var rule_id = $("#filterrule_id").val();
    var group_id = $("#filtergroup_id").val();
    var rule_name = $("#rule_name").val();
    if(!rule_name){
      $("#rule_name").addClass("is-invalid");
      return;
    } else {
      $("#rule_name").removeClass("is-invalid");
    }
    var rule_sizelimit = $("#rule_sizelimit").val();
    if(rule_sizelimit){
      var reg = /^[0-9,]*$/;
      if(!reg.test(rule_sizelimit)){
        $("#rule_sizelimit").addClass("is-invalid");
        return;
      }else{
        $("#rule_sizelimit").removeClass("is-invalid");
      }
    }
    var params = {rule_id: rule_id,
                  group_id: group_id,
                  rule_name: rule_name,
                  rule_pri: $("#rule_pri").val(),
                  rule_include: $("#rule_include").val(),
                  rule_exclude: $("#rule_exclude").val(),
                  rule_sizelimit: rule_sizelimit
                  };
    ajax_post("add_filterrule", params, function (ret) {
      if(ret.code == 0){
        $("#modal-add-filterrule").modal('hide');
        navmenu('filterrule');
      }
    });
  }

  // 删除规则
  function delete_filterrule(id){
    var params = {"id": id};
    ajax_post("del_filterrule", params, function (ret) {
      $("#modal-add-filterrule").modal('hide');
      navmenu('filterrule');
    });
  }

</script>